
import { Meta } from "@storybook/addon-docs";
import ImageFile from '../.storybook/public/footer-bg.png';

<Meta title="Welcome" />

<div class="storybook-welcome">
  <h2>Welcome to the Rancher Storybook</h2>
  <img src={ImageFile} />
</div>

This Storybook documents the components and the design system that is used in the Rancher UIs.

For Rancher Dashboard Developer Documentation, see [here](https://rancher.github.io/dashboard/home).

> Note: This Storybook site is being actively developed and is currently a work-in-progress.

> Note that you can toggle between dark and light modes using the moon/sun icon the toolbar or with the keyboard shortcut CMD+T (Mac) or CTRL+T (Windows/Linux).

<br/>

### Writing stories  

<p>To add more components stories, please refer to the <a href="https://storybook.js.org/docs/vue/writing-docs/mdx#basic-example" target="_blank">official Storybook documentation</a>.</p>
